{include file='common/head'}
<script>
    document.title = "{$data.category} | {:config('system.base.title')} "
</script>
<link rel="stylesheet" href="__css__/index/category/index.css">
<link rel="stylesheet" href="__css__/index/category/detail.css">
<link rel="stylesheet" href="__css__/index/account/index.css">
<div class="layout">
    <span class="layui-breadcrumb">
        <a href="{:url('/index/index/index')}">首页</a>
        <a href="{:url('/index/category/index')}">文章分类</a>
        <a><cite>{$data.category}</cite></a>
    </span>
    <div class="sdata">
        <div class="bg-navbar clearfix">
            <img src="{$data.img_path|default='__IMG__/other/no-img.jpg'}" alt="" class="category-img">
            <p class="data">
                <span class="layui-font-black layui-font-16">{$data.category}</span><br>
                <span class="layui-font-gray layui-font-12">今日：{$list.todayNum}</span><br>
                <span class="layui-font-gray layui-font-12">主题数：{$list.totalNum}</span><br>
                <!-- <span class="layui-font-gray layui-font-12">版主：Admin</span> -->
            </p>
            <div id="sign">
                <button class="layui-btn layui-bg-{$hasFollow == true ? 'orange' : 'blue'} layui-btn-sm" onclick="follow(this , '{$data.id}')">{$hasFollow==true ? '已关注' : '+关注'}</button>
                <button class="layui-btn layui-bg-blue layui-btn-sm"
                    onclick="window.location.href='{:url(\'/index/article/add\',[\'cid\' => $data.id])}'">发布</button>
            </div>
        </div>

    </div>
    <ul class="theme-list">
        <div class="category-list">
            <button class="layui-btn layui-btn-primary  layui-btn-sm layui-border-blue cate-detail"
                data-url="{:url('/index/category/detail',['cid' => $Request.session.cate.id ?? '', 'type' => 'all'])}">全部</button>
            <button class="layui-btn layui-btn-primary  layui-btn-sm layui-border-blue cate-detail"
                data-url="{:url('/index/category/detail',['cid' => $Request.session.cate.id ?? '' , 'type' => 'new'])}">最新</button>
            <button class="layui-btn layui-btn-primary  layui-btn-sm layui-border-blue cate-detail"
                data-url="{:url('/index/category/detail',['cid' => $Request.session.cate.id ?? '' , 'type' => 'hot'])}">最热</button>
            {volist name="threeList" id="cate"}
            <button class="layui-btn layui-btn-primary  layui-btn-sm layui-border-blue cate-detail"
                data-url="{:url('/index/category/detail' , ['cid' => $cate.id])}">{$cate.category}</button>
            {/volist}
        </div>
    </ul>
    <ul class="list">
        {if count($list.list) == 0}
        <p class="no-data">什么也没有~</p>
        {/if}
        {volist name="list.list" id="item"}
        <li>
            <div class="art-box">
                <p class="t-title layui-font-black layui-font-16">
                    {$item.is_top == 1 ? '<span class="span is_top">置顶</span>' : ''}
                    {$item.is_hot == 1 ? '<span class="span is_hot">加精</span>' : ''}
                    {$item.type == 3 ? '<span class="span is_ques">提问</span>' : ''}
                    <a href="{:url('index/article/index' , ['art_id' => $item.id])}">{$item.title} </a>
                </p>
                <div class="art-info">
                    <p>
                        <span><a href="{:url('/index/profile/index',['uid' => $item.user_id])}"
                                class="author layui-font-blue layui-font-15">{$item.nickname}</a></span>
                        <span class="layui-font-gray layui-font-12">{$item.create_time}</span>
                    </p>
                    <p>
                        <i class="layui-icon-eye layui-icon layui-font-12">&nbsp;{$item.heat}</i>
                        <i class="layui-icon-dialogue layui-icon layui-font-12">&nbsp;{$item.commentCount}</i>
                        <i class="layui-icon-heart layui-icon layui-font-12">&nbsp;{$item.collectCount}</i>
                    </p>
                </div>
            </div>
        </li>
        {/volist}
        <div class="paginate">
            {$page|raw}
        </div>
    </ul>


</div>
{include file='common/bottom'}
<script>
    layui.use(function () {
        const layer = layui.layer
        const $ = layui.$
        // 渲染点击按钮
        const btnObj = $('.category-list button')
        const arr = []
        Object.keys(btnObj).map((e) => {
            if (btnObj[e].innerHTML != undefined) {
                arr.push(btnObj[e])
            }
        })
        let url = window.location.pathname + window.location.search
        let uri = '', j = 0
        for (i = 0; i < arr.length; i++) {
            uri = arr[i].dataset.url
            if (url.includes(uri)) {
                $(arr[i]).removeClass('layui-btn-primary')
                $(arr[i]).removeClass('layui-border-blue')
                $(arr[i]).addClass('layui-bg-blue')
                j++
                break
            }
        }
        if (j == 0) {
            $(arr[0]).removeClass('layui-btn-primary')
            $(arr[0]).removeClass('layui-border-blue')
            $(arr[0]).addClass('layui-bg-blue')
        }
        $('.cate-detail').click(function () {
            let url = $(this).data('url')
            window.location.href = url
        })

    })


    function follow(th, id) {
        let url = ""
        let cid = id
        if ("{$base.isLog}") {
            $.get('/index/category/follow', { cid: cid }, (res) => {
                if (res.code == 200) {
                    layer.msg(res.message, { icon: 6 })
                    var str =  $(th)[0].innerText
                    if (str.trim() == '+关注') {
                        $(th)[0].innerHTML = `已关注`
                        $(th).removeClass('layui-bg-blue')
                        $(th).addClass('layui-bg-orange')
                    } else {
                        $(th)[0].innerHTML = `+关注`
                        $(th).removeClass('layui-bg-orange')
                        $(th).addClass('layui-bg-blue')
                    }

                } else {
                    layer.msg(res.message, { icon: 5 })
                }
            }
                , 'json')
        }
        else {
            layer.confirm('请先登录再来操作哦！', () => {
                window.location.href = "{:url('/index/login/index')}"
            })
        }
    }
</script>